<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="Plugins for Blueprint CSS Framework" /> 
<meta name="keywords" content="Plugins for Blueprint CSS Framework" />
<meta name="author" content="Marcin Habryn (widmogrod@gmail.com)"/>

<!-- Framework CSS -->
<link rel="stylesheet" href="../../libs/blueprint/screen.css" type="text/css" media="screen, projection"/>

<!-- Plugin -->
<link rel="stylesheet" href="../../plugins/messages/messages.css" type="text/css" media="screen, projection"/>


<title>Blueprint CSS - Plugins :: Actions</title>
</head>
<body>
<div class="container">
	<h1><a href="http://code.google.com/p/blueprint-plugins/">Blueprint Css plugins :: Actions</a></h1>
	<hr/>

	<h2>Wstęp</h2>
	<p>Plugin w założeniu ma pomóc w szybkim udekorowaniu backend-owych części serwisu takich jak:</p>
	<ul>
		<li>linki akcji (&lt;a class=”action add”&gt;anchor&lt;/a&gt;)</li>
		<li>przycisk submit,button (&lt;input type=”button” class=”action add” /&gt;)</li>
		<li>styli listy (&lt;li class=”action add”&gt;name&lt;/li&gt;)</li>
		<li>itd.</li>
	</ul>

	<h2>Zastosowanie</h2>
	
	<p>Zastosowanie go w celach frontend-owych może mieć sens ale należy Sobie odpowiedzieć na pytanie:<br/>
	czy potrzebujemy tak dużego zestawu akcji?</p>
	<p>Podstawowy przykład użycia - wszystkie zestawy:</p>
	<code>
		&lt;link rel="stylesheet" href="../../plugins/messages/messages.css" type="text/css" /&gt;
	</code>
	
	<h3>Praktycznie</h3>
	
	<code>
		&lt;p class="msg-info" >&lt;/p&gt;
		&lt;p class="msg-info" &gt;Text &lt;span class="arrow-lb" &gt;&lt;/span&gt;&lt;/p&gt; &lt;-- przykład chmurki--&gt;
		&lt;div class="msg-info" >&lt;/div&gt;
	</code>


	<h2>Przykład</h2>
	<p>Poniżej prezentuję zestawienie trzech podstawowych wielkości ikon</p>
	<ul>
		<li>normal</li>
		<li>small</li>
		<li>big (w trakcie rozwoju – a dokładniej brak ikon, szukanie zastępczych)</li>
	</ul>
	
	<p>i ich wizualizację</p>

	<h4>Blok</h4>

	<p class="msg-info">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est. </p>
	<p class="msg-success">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est. </p>
	<p class="msg-notice">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est. </p>
	<p class="msg-warning">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est. </p>
	<p class="msg-error">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est. </p>
	
	<h4>Chmurka</h4>

	<p class="msg-info">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est.
		<span class="arrow-lb"></span></p>
	<p class="msg-success">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est.
		<span class="arrow-lb"></span></p>
	<p class="msg-notice">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est.
		<span class="arrow-lb"></span></p>
	<p class="msg-warning">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est.
		<span class="arrow-lb"></span></p>
	<p class="msg-error">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus consectetuer molestie magna. Nunc molestie quam nec orci. Donec dolor ipsum, aliquet id, tempus sit amet, tincidunt ac, nunc. Nam non elit sit amet erat placerat mattis. Quisque eu lorem. Donec risus neque, tincidunt ut, adipiscing at, condimentum a, augue. Donec in purus. In hac habitasse platea dictumst. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Maecenas rhoncus neque vitae est.
		<span class="arrow-lb"></span></p>
	

</div>
</body>
</html>